<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script type="text/javascript">
        function getOne(){
            var p = document.querySelector(".p");
            alert(p.innerHTML);
        }
        function getAll(){
            var p =document.querySelectorAll(".p");
            for(var i in p){
                alert(p[i].innerHTML);
            }
        }
    </script>
</head>
<body>
<p class="p">querySelector只返回匹配的第一个元素，如果没有匹配项，返回null。</p>
<p class="p">querySelectorAll返回匹配的元素集合，如果没有匹配项，返回空的nodelist(节点数组)。</p>
<p class="p">返回的结果是静态的，之后对document结构的改变不会影响到之前取到的结果</p>
<button onclick="getOne()">获取第一段话</button>
<button onclick="getAll()">获取全部段落</button>
</body>
</html>